<template>
	<view class="qxlj_back4 contain">
		<view class="con_top">
			<view class="con_name">
				<view class="left">
					<text>商家名称</text>
					<text class="one">*</text>
				</view>
				<view class="right">
					<u--input placeholder="请输入" border="none" v-model="listValue.shopName"></u--input>
				</view>
			</view>
			<view class="con_name">
				<view class="left">
					<text>姓名</text>
					<text class="one">*</text>
				</view>
				<view class="right">
					<u--input placeholder="请输入" border="none" v-model="listValue.name"></u--input>
				</view>
			</view>
			<view class="con_name con_tel">
				<view class="left">
					<text>联系电话</text>
					<text class="one">*</text>
				</view>
				<view class="right">
					<u--input type="number" placeholder="请输入" border="none" v-model="listValue.tel"></u--input>
				</view>
			</view>
		</view>
		<view class="con_bottom">
			<view class="right">
				<u--textarea v-model="listValue.note" placeholder="留言:" height="150px"></u--textarea>
			</view>
		</view>

		<view class="btn_box" v-if="btnShow">
			<u-button @click="submit" shape="circle" text="提交"></u-button>
		</view>
	</view>
</template>

<script>
	import {
		GetBusinessApplyDetail,
		getBusinessApplyUpload
	} from '@/api/qxlj.js';
	export default {
		data() {
			return {
				listValue: {
					shopName: '',
					name: '',
					tel: '',
					note: '',
					id: 0,
				},
				btnShow:true,
			}
		},
		onLoad() {
			//获取数据
			this.getDetail();
		},
		methods: {
			async getDetail() {
				try {
					const {
						Data
					} = await GetBusinessApplyDetail({});
					console.log(Data)
					if (Data.ID != 0) {
						this.listValue.shopName = Data.CompanyName;
						this.listValue.name = Data.UserTrueName;
						this.listValue.tel = Data.Tel;
						this.listValue.note = Data.Note;
						this.listValue.id = Data.ID;
					}
					if(Data.IsBusiness!=3){
						this.btnShow = false;
					}
				} catch (e) {
					console.log(e)
					//TODO handle the exception
				}
			},
			submit() {
				let listV = this.listValue;
				if (listV.shopName == '') {
					uni.showToast({
						icon: 'error',
						title: '请输入商家名称',
						duration: 2000
					});
					return;
				} else if (listV.name == '') {
					uni.showToast({
						icon: 'error',
						title: '请输入姓名',
						duration: 2000
					});
					return;
				} else if (listV.tel == '') {
					uni.showToast({
						icon: 'error',
						title: '请输入联系电话',
						duration: 2000
					});
					return;
				}
				console.log(listV)
				this.postData(listV);
			},

			//提交数据
			async postData(e) {
				try {
					const {
						Data
					} = await getBusinessApplyUpload({
						CompanyName: e.shopName,
						UserTrueName: e.name,
						Tel: e.tel,
						Note: e.note,
						ID:e.id
					});
					console.log(Data)
					uni.showToast({
						title: '提交成功',
						icon: 'success',
						duration: 2000
					});
				} catch (e) {
					console.log(e)
					//TODO handle the exception
				}
			},
		},
	}
</script>

<style scoped lang="scss">
	.contain {
		width: 100%;
		height: 100vh;
		padding: 4%;
	}

	.con_top {
		background-color: #fff;
		border-radius: 20rpx;

		.con_name {
			padding: 0 20rpx;
			width: 100%;
			height: 100rpx;
			display: flex;
			align-items: center;
			color: #333333;
			border-bottom: 1px dashed #E6E6E6;

			.left {
				width: 30%;

				.one {
					color: red;
				}
			}

			.right {
				width: 70%;
			}
		}

		.con_tel {
			border-bottom: none;
		}
	}

	.con_bottom {
		background-color: #fff;
		margin-top: 4%;
		border-radius: 20rpx;

		.right {
			/deep/ .u-textarea {
				border: none;
				border-radius: 20rpx !important;
			}
		}
	}

	.btn_box {
		width: 80%;
		margin: 0 auto;
		margin-top: 5%;

		/deep/ .u-button {
			background-color: #498FFF;
			color: #fff;
			height: 96rpx !important;
		}

		/deep/ .u-button__text {
			font-size: 30rpx !important;
			font-weight: bold;
		}
	}
</style>